<template lang="html">
  <div class="wraper">
      <div class="liveContainer" v-for="(item,index) in liveData">
          <div class="pic">
            <img :src="item.url" alt="">
          </div>
          <div class="desc">
              {{item.title}}
          </div>
      </div>
  </div>
</template>

<script>
export default {
  name:"live",
  data(){
    return{
      liveData:[

      ]
    }
  },
  created(){
      const recommendSeeUrl="http://localhost:8080/static/lives.json"
      // const recommendSeeUrl=this.HOST+"/v1/restserver/ting?method=baidu.ting.song.getRecommandSongList&song_id=877578&num=5"
      this.$axios.get(recommendSeeUrl)
      .then(res=>{
          // console.log(res.data);
          this.liveData=res.data.liveData;
      })
      .catch((error) => {
        console.log(error);
      })
  }

}
</script>

<style scoped>
.wraper{
  overflow: hidden;
}
.liveContainer{
  width: 3.7rem;
  float: left;
  margin-right: .05rem;
  /* height: 3.7rem; */
}
.liveContainer .pic,.liveContainer .pic img{
  width: 3.7rem;
  height:3.7rem;
}
.liveContainer .desc{
  height:.8rem;
  width: 3.7rem;
}

</style>
